﻿<div class="signin" data-bind="with: signInView">
    @Html.Partial("SignIn")
</div>
<div class="row full-width">
    <div class="large-2 columns tags-nav" data-bind="with: tags">
        @Html.Partial("TagsList")
    </div>
    <div class="large-10 columns">
        <div data-bind="visible: screen() == 'products', with: products">
            @Html.Partial("ProductCategories")
        </div>
        <div data-bind="visible: screen() == 'cart', with: cart">
            @Html.Partial("Cart")
        </div>
        <div data-bind="visible: screen() == 'product', with: product">
            @Html.Partial("ProductInfo")
        </div>
        <div data-bind="visible: screen() == 'productDetails', with: productDetails">
            @Html.Partial("ProductDetails")
        </div>
        <div data-bind="visible: screen() == 'reviewDetails', with: reviewDetails">
            @Html.Partial("ReviewDetails")
        </div>
        <div data-bind="visible: screen() == 'orders', with: ordersView">
            @Html.Partial("Orders")
        </div>
        <div data-bind="visible: screen() == 'order', with: orderView">
            @Html.Partial("Order")
        </div>
         <div data-bind="visible: screen() == 'thankyou'">
            @Html.Partial("ThankYou")
        </div>
        <div data-bind="visible: screen() == ''">
            E-commerce
        </div>
    </div>
</div>
<script type="text/javascript">
    (function () {
        var $body = $('body');
        var urls = {
            productsUri: $body.attr('products-uri'),
            cartsUri: $body.attr('carts-uri'),
            sessionUri: $body.attr('session-uri'),
            recommendationsUri: $body.attr('recommendations-uri'),
            ordersUri: $body.attr('orders-uri'),
        };
        var model = new ECommerceViewModel(urls);
        
        ko.applyBindings(model);
    })();

    $(document).ready(function () {
        var $view = $('.signin');

        if (window.localStorage.getItem('account') === null || window.localStorage.getItem('account') === '')
            $view.toggleClass('visible');
        
        $('.toggle-signin').bind('click', function () {
            $view.toggleClass('visible');
        });
    });
</script>
